<div ng-controller="order_complaintController">
    <!--<div>-->
    <div style="width: 95%;margin: auto;position: relative;">
        <table class="table table-hover" style="width: 100%">
            <thead>
            <tr>
                <th style="text-align: center">Merchant</th>
                <th style="text-align: center">Client</th>
                <th style="text-align: center">Complaint</th>
                <th style="text-align: center">Date</th>
                <th style="text-align: center">Status</th>
                <th style="text-align: center">Detail</th>
                <th></th>
            </tr>
            </thead>
            <tbody ng-repeat="complaint in complaints | orderBy : ['status', 'createDate']">
            <tr id="complaint-{{complaint._id}}">
                <td class="list-td" width="10%">{{complaint.detail.merchant.mname}}</td>
                <td class="list-td" width="10%">{{complaint.detail.client.cname }}</td>
                <td class="list-td" width="30%">{{complaint.detail.complain }}</td>
                <td class="list-td" width="15%">{{complaint.createDate | date : 'yyyy-MM-dd hh:mm:ss'}}</td>
                <td class="list-td" width="9%">{{complaint.status | convertComplaintStatus}}</td>
                <td class="list-td" width="8%"><span
                        ng-click="complaint.showDetail = !complaint.showDetail" style="cursor: pointer;"
                        class="glyphicon glyphicon-plus"></span></td>
                <td class="list-td" width="12%">
                    <div class="btn-group" uib-dropdown dropdown-append-to-body>
                        <button id="btn-append-to-body" type="button" uib-dropdown-toggle ng-disabled="{true : false, false: true}[complaint.status == 0]" class="btn" ng-class="{true : 'btn-default', false: ''}[complaint.status == 0]">
                            Operate <span class="caret"></span>
                        </button>
                        <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="btn-append-to-body">
                            <li role="menuitem"><a href="javascript:void(0)" ng-click="updateStatus(complaint, 1)">Dismiss complaint</a></li>
                            <li role="menuitem"><a href="javascript:void(0)" ng-click="updateStatus(complaint, 2)">Deduct deposit</a></li>
                            <li role="menuitem"><a href="javascript:void(0)" ng-click="openWarning(complaint)">Block Merchant</a></li>
                        </ul>
                    </div>
                </td>
            </tr>
            <tr ng-show="complaint.showDetail" style="background-color:#f4f7f9" id="detail-{{complaint._id}}">
                <td style="vertical-align: middle" colspan="2">
                    <b>merchant:</b><br/>
                    {{complaint.detail.merchant.mname}}<br/>
                    {{complaint.detail.merchant.mtel }}
                </td>
                <td style="vertical-align: middle" colspan="1">
                    <b>client:</b><br/>
                    {{complaint.detail.client.cname }}<br/>
                    {{complaint.detail.client.ctel }}
                </td>
                <td style="vertical-align: middle" colspan="4">
                    <b>order:</b><br/>
                    {{complaint._id }}<br/>
                    {{complaint.detail.createDate | date : 'yyyy-MM-dd hh:mm:ss'}}<br/>
                    <ul>
                        <li ng-repeat="oitem in complaint.detail.orderItem">{{oitem.dish.dname }} ---- ¥ {{ oitem.dish.price}} * {{oitem.num}}</li>
                    </ul>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
    <div ng-include="'/client/pages/merchantWarning_modal.html'"></div>
</div>